<template>
  <el-menu
    class="top_lan"
    mode="horizontal"
    background-color="#545c64"
    text-color="#fff"
    active-text-color="#ffd04b"
  >
    <el-menu-item index="0" @click="goApply">
      <template slot="title">
        <span slot="title" style="color: #fff">大数据集群自动化部署后台管理系统</span>
      </template>
    </el-menu-item>

    <el-menu-item index="1" @click="goUser">
      <template slot="title">
        <i class="el-icon-s-home"></i>
        <span slot="title">用户管理</span>
      </template>
    </el-menu-item>

    <el-menu-item index="2" @click="goHost">
      <template slot="title">
        <i class="el-icon-s-home"></i>
        <span slot="title">主机管理</span>
      </template>
    </el-menu-item>

    <el-menu-item index="3" @click="goCluster">
      <template slot="title">
        <i class="el-icon-s-home"></i>
        <span slot="title">集群管理</span>
      </template>
    </el-menu-item>

    <el-menu-item index="4" @click="goLog">
      <template slot="title">
        <i class="el-icon-s-home"></i>
        <span slot="title">日志管理</span>
      </template>
    </el-menu-item>

    <el-submenu index="5" id="right">
      <template slot="title">张三（超级管理员）</template>
      <el-menu-item index="5-1" @click="goUserHome">个人中心</el-menu-item>
      <el-menu-item index="5-2" @click="logout">退出</el-menu-item>
    </el-submenu>
  </el-menu>
</template>

<style lang="scss" scoped>
top_lan {
  display: flex;
  height: 100%;
  align-items: center;
  justify-content: space-between;
}
.r-content {
  .userImg {
    width: 40px;
    height: 40px;
    border-radius: 50%;
  }
}
#right{
  float: right;
}
</style>

<script>
// import Axios from "axios";
export default {
  data() {
    return {
      // adminuser: JSON.parse(sessionStorage.getItem('adminuser')),
      isCollapse: false,
    };
  },
  methods: {
    goUser() {
      this.$router.push("/user");
    },
    goUserHome() {
      this.$router.push("/userhome");
    },
    goHost() {
      this.$router.push("/host");
    },
    goApply() {
      this.$router.push("/apply");
    },
    goCluster() {
      this.$router.push("/cluster");
    },
    goLog() {
      this.$router.push("/log");
    },
    logout(){
      // Axios.get('/logout').then((res) =>{
      //   console.log(res);
      //   if (res.data.state == 1){ // 退出成功，跳转登陆页面
      //     alert(res.data.msg);
      //     this.$router.push('/login');
      //   }else{
      //     alert(res.data.msg);
      //   }
        this.$router.push("/login")
      },
    },
};
</script>
